import { Button, Divider } from 'antd';
import { useSelector, useDispatch } from 'umi';
// import { useEffect } from 'react';

const Index = () => {
  // 不要忘记加模块名称
  const count = useSelector((state: any) => state.index.count);
  const list = useSelector((state: any) => state.index.list);
  const dispatch = useDispatch();

  return (
    <div>
      <h2>dva状态管理</h2>
      <Button
        type="primary"
        onClick={() => dispatch({ type: 'index/decrement', num: 4 })}
      >
        -
      </Button>
      <span>{count}</span>
      <Button
        type="primary"
        onClick={() => dispatch({ type: 'index/increment' })}
      >
        +
      </Button>

      <Divider plain></Divider>

      <ul>
        {list.map((item: any) => (
          <li key={item.goodsId}>{item.goodsName}</li>
        ))}
      </ul>
    </div>
  );
};

Index.wrappers = ['@/wrappers/auth'];

export default Index;
